<template>
	<div class="friend">
		<el-card class="box-card">
		  <div slot="header" class="d-flex align-items-center">
		  	<img class="card-icon" :src="pic"/>
		    <span>友链</span>
		    <el-button class="ml-auto" style="padding: 3px 0" type="text">
		    	<router-link to="/apply" tag="span">互换友链</router-link>
		    </el-button>
		  </div>
		  <div class="text item">
			 <h5><el-link href="http://www.baidu.com/article"  :underline="false" tag="span" class="art-title">tes博客</el-link></h5>
				</div>
		  <div class="text item">
			  <h5><el-link href="http://www.baidu.com/article"  :underline="false" tag="span" class="art-title">tes博客</el-link></h5>
				</div>
		</el-card>
	</div>
</template>

<script>
export default {
  name: 'friend',
  data(){
    return {
    pic:'/static/image/lianjie.png',
  }
},
}
</script>

<style scoped>
.box-card .item a{
	text-decoration: none;
	/*color: #F56C6C;*/
}
.box-card span{
	font-weight: bold;
}
.card-icon{
	width: 20px;
	height: 20px;
	margin-right: 10px;
}
.art-title {
		border-left: 3px solid #409EFF;
		padding-left: 5px;
		cursor: pointer;
	}
	
	.art-title:hover {
		padding-left: 10px;
		color: goldenrod;
	}
</style>